<template>
	<div class="front-padding" v-loading="loading" element-loading-text="数据加载中..." element-loading-spinner="el-icon-loading" element-loading-background="#fff">
		<el-input v-model="searchText" placeholder="输入关键字" style="margin: 0 0 10px!important"></el-input>
		<div class="tree bj bg-white">
			<el-scrollbar style="height: 100%;">
				<el-tree :data="treeData" accordion node-key="id" :props="defaultProps" :filter-node-method="filterNode" ref="tree" @node-click="nodeClick" :default-expand-all="true" highlight-current :expand-on-click-node="false"></el-tree>
			</el-scrollbar>
		</div>
	</div>
</template>
<script>
export default {
	data() {
		return {
			loading: true,
			searchText: '',
			treeData: [],
			defaultProps: {
                label: 'name',
                children: 'subDepartment'
            }
		}
	},
	watch: {
        searchText(val) {
            this.$refs.tree.filter(val);
        }
    },
    computed: {
    	systemId() {
    		return this.$store.state.systemId;
    	},
    	companyName() {
    		return this.$store.state.companyName;
    	}
    },
    methods: {
    	getTreeData() {
    		let data = {
                name: this.companyName,
                id: this.systemId,
                level: 0,
                subDepartment: []
            }
            this.loading = true;
            this.$http.get('department/selectObject?systemId=' + this.systemId).then(res => {
                if(res.data.code == 20001) {
                	setTimeout(() => {
                		this.loading = false;
                		if(res.data.data) {
	                        data.subDepartment = res.data.data;
	                    }
                	}, 250);
                } else {
                	setTimeout(() => {
                		this.loading = false;
                	}, 250);
                }
            }).catch(() => {
            	setTimeout(() => {
            		this.loading = false;
            	}, 250);
            });
            this.treeData = [data];
    	},
    	filterNode(value, data) {       //过滤查询树形节点
            if (!value) return true;
            return data.name.indexOf(value) !== -1;
        },
    	nodeClick(row) {
    		let store = this.$store.state.verifyProcessStore;
    		let data = {
    			id: row['id'],
    			name: row['name'],
    			level: 2,
                billId: store.billId,
                pid: store.vercharId,
    			children: [],
    			subList: [
    				{
    					id: store.dfId,
    					name: store.dfName,
    					level: 3,
                        billId: store.billId,
                        vercharId: store.vercharId,
                        pid: row['id'],
    					children: [],
    					subList: [
    						{
                                id: store.dfId,
                                name: store.minMoney + ' ~ ' + store.maxMoney,
                                level: 4,
                                money1: store.minMoney,
                                money2: store.maxMoney,
                                billId: store.billId,
                                vercharId: store.vercharId,
                                deptId: row['id'],
                                pid: store.dfId,
                                children: [],
                                subList: []
                            }
    					]
    				}
    			]
    		}
    		if(row['parentId'] == 0) {
        		data['parentId'] = 0;
        		data['parentName'] = this.companyName;
        		this.$store.commit('verifyProcessStore/appendNode', data);
        		this.close();
        	} else {
        		//根据部门id找到上级部门名称
        		this.$http.get('department/selectObjectById?id=' + row['parentId']).then(res => {
        			if(res.data.code == 20001) {
        				if(res.data.data) {
        					data['parentId'] = row['parentId'];
        					data['parentName'] = res.data.data['name'];
        					this.$store.commit('verifyProcessStore/appendNode', data);
        					this.close();
        				}
        			}
        		});
        	}
    	},
    	close() {		//关闭
            let index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
        }
    },
    created() {
    	this.getTreeData();
    }
}
</script>
<style scoped>
	.tree {height: calc(100% - 50px);box-sizing: border-box;padding: 5px 0;}
	.tree .el-tree {height: 100% !important;overflow-y: auto !important;}
</style>